<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta name="description" content="">
		<meta name="author" content="">
		<title>banner图</title>
		<link rel="stylesheet" href="../../../css/base.css" />
		<link rel="stylesheet" href="../../../css/common.css" />
		<link rel="stylesheet" type="text/css" href="update-banner.css">
		<!-- Bootstrap Core CSS -->
		<link href="../../../sbadmin/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
		<!-- MetisMenu CSS -->
		<link href="../../../sbadmin/bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">
		<!-- DataTables CSS -->
		<link href="../../../sbadmin/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" rel="stylesheet">
		<!-- Custom CSS -->
		<link href="../../../sbadmin/dist/css/sb-admin-2.css" rel="stylesheet">
		<!-- Custom Fonts -->
		<link href="../../../sbadmin/bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
		<link rel="stylesheet" href="../../../css/jquery.datetimepicker.css" />
		<script src="https://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script>
		<script src="ul_file.js"></script>
		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
	</head>

	<body style="background:#fff;">
		<div class="container-fluid" style="background-color: #fff;">
			<div class="comm-tt-font pr" style="margin-bottom: 20px;">
				banner图 > 修改
			</div>
			<div class="ubdatebox">
				<div class="cityname clearfix">
					<span class="name fl"><em>*</em>banner图：</span>
					<div class="namebox fl" style="width: 325px;height: 304px;">
						<input type="file" class="file-style" id="file" onchange="xmTanUploadImg(this)" />
						<img id="xmTanImg" src="" class="namepic" />
						<input type="hidden" id="imghidden" value="" />
					</div>
					<div class="fl m10" style="margin-top: 140px;">(建议尺寸325*304)</div>
				</div>
				<div class="cityname">
					<span class="name"><em>*</em>名称：</span>
					<input type="text" class="nameinput" id="bannerName" />
				</div>
				<div class="cityname">
					<span class="name"><em>*</em>上架时间：</span>
					<input type="text" class="nametime" placeholder="请输入" id="tstart" />
				</div>
				<div class="cityname">
					<span class="name"><em>*</em>下架时间：</span>
					<input type="text" placeholder="请输入" class="nametime" id="tend" />
				</div>
				<div class="cityname clearfix">
					<span class="name fl mt10"><em>*</em>用于城市：</span>
					<div class="fl">
						<ul class="shop-type clb mt5" id="cityAll">

						</ul>
					</div>
				</div>
				<div class="cityname">
					<span class="name"><em>*</em>跳转类型：</span>
					<select class="nametime" id="commodity1">
						<option value="0">商品</option>
						<option value="1">网页</option>
					</select>
				</div>
				<div class="cityname" id="goodsType">
					<span class="name">跳转商品：</span>
					<select class="nametime" id="commodity2"></select>
				</div>
				<div class="cityname none" id="linkType">
					<span class="name">跳转链接：</span>
					<input type="text" class="nameinput" id="tzUrl" />
				</div>
				<div class="cityname">
					<span class="name">Banner排序：</span>
					<input type="text" placeholder="请输入" class="nametime" id="sort" />
				</div>
				<div class="btntbox">
					<a href="../banner/banner.html" class="lbtn fl">取消</a>
					<a href="javascript:void(0)" class="rbtn fl" id="cbQrbtn">确定</a>
				</div>
			</div>
		</div>
		<!-- jQuery -->
		<script src="../../../sbadmin/bower_components/jquery/dist/jquery.min.js"></script>
		<!-- Bootstrap Core JavaScript -->
		<script src="../../../sbadmin/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
		<!-- Metis Menu Plugin JavaScript -->
		<script src="../../../sbadmin/bower_components/metisMenu/dist/metisMenu.min.js"></script>
		<!-- DataTables JavaScript -->
		<script src="../../../sbadmin/bower_components/datatables/media/js/jquery.dataTables.min.js"></script>
		<script src="../../../sbadmin/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js"></script>
		<!-- Custom Theme JavaScript -->
		<script src="../../..//sbadmin/dist/js/sb-admin-2.js"></script>
		<!-- Page-Level Demo Scripts - Tables - Use for reference -->
		<script src="../../../js/layer/layer.js"></script>
		<script type="text/javascript" src="../../../js/jquery-ui.min.js"></script>
		<script type="text/javascript" src="../../../js/jquery.datetimepicker.full.js"></script>
		<script src="../../../js/layer/layer.js"></script>
		<script type="text/javascript" src="../../../js/common.js"></script>
	</body>
	<script>
		$.datetimepicker.setLocale('ch'); //转换成中文
		$('#tstart').datetimepicker({
			lang: "ch", //语言选择中文 注：旧版本 新版方法：$.datetimepicker.setLocale('ch');
			format: 'Y-m-d H:i:s',
			timepicker: true, //关闭时间选项
			yearStart: 2000, //设置最小年份
			yearEnd: 2050, //设置最大年份
			todayButton: false, //关闭选择今天按钮
			step: 5,
			//  startDate: enddate + "-" + "01"
		});
		$('#tend').datetimepicker({
			lang: "ch", //语言选择中文 注：旧版本 新版方法：$.datetimepicker.setLocale('ch');
			format: 'Y-m-d H:i:s',
			timepicker: true, //关闭时间选项
			yearStart: 2000, //设置最小年份
			yearEnd: 2050, //设置最大年份
			todayButton: false, //关闭选择今天按钮
			step: 5,
			//  startDate: enddate + "-" + "01"
		});
		var ctType = []; //门店类型
		//修改id
		var updateId = localStorage.getItem("updateId");
		$.ajax({
			url: "https://order.wz1996.wang/wzbg/banner/one/" + updateId,
			type: 'get',
			contentType: 'application/json',
			beforeSend: function(request) {
				request.setRequestHeader("token", localStorage.getItem("token"));
			},
			success: function(data) {
				console.log(data);
				if(data.code == "1") {
					$("#xmTanImg").attr("src", data.data.banner.imageUrl);
					$("#imghidden").val(data.data.banner.imageUrl);
					$("#bannerName").val(data.data.banner.name);
					$("#tstart").val(data.data.banner.onDaytime);
					$("#tend").val(data.data.banner.offDaytime);
					$("#cityAll li").each(function(j) {
						var sdid = $("#cityAll li").eq(j).attr("id");
						for(var i = 0; i < data.data.openedCities.length; i++) {
							if(sdid == data.data.openedCities[i].cityId) {
								$("#cityAll li").eq(j).addClass("cur");
							}
						}
					})

					$("#commodity1").find("option[value = '" + data.data.banner.type + "']").attr("selected", "selected");
					if(data.data.banner.type == "0") {
						$("#commodity2").find("option[value = '" + data.data.banner.value + "']").attr("selected", "selected");
					} else {
						$("#tzUrl").val(data.data.banner.value);
					}
					$("#sort").val(data.data.banner.sort);
					$("#cityAll li").each(function(p) {
						var hasClass = $("#cityAll li").eq(p).hasClass("cur");
						var th = {};
						if(!hasClass) {
							for(var i = 0; i < ctType.length; i++) {
								if(ctType[i].id == $(this).attr("id")) {
									ctType.splice(i, 1);
									i--;
								}
							}
							//remove(shopType, $(this).attr("id"))
						} else {
							th['cityId'] = $(this).attr("id");
							ctType.push(th);
							//shopType.push($(this).attr("id"))
						}

					})
				} else if(data.code == "-1") {
					layar(data.msg);
					setTimeout("window.parent.frames.location.href='/xcxadmin/login.html'", 1000)
				} else {
					layar(data.msg);
				}

			},
			error: function(e) {
				errcode(e);
			}
		});

		//会员卡照片
		var img = document.getElementById("xmTanImg");

		function xmTanUploadImg(obj) {
			$("#ttt").css("display", "none");
			var file = obj.files[0];
			var reader = new FileReader();
			//读取文件过程方法
			reader.onloadstart = function(e) {
				console.log("开始读取....");
			}
			reader.onprogress = function(e) {
				console.log("正在读取中....");
			}
			reader.onabort = function(e) {
				console.log("中断读取....");
			}
			reader.onerror = function(e) {
				console.log("读取异常....");
			}
			reader.onload = function(e) {
				console.log("成功读取....");
				img.src = e.target.result;
				// 保存会员照片
				localStorage.setItem("memberPhone", img.src);
				var icinmguuii = document.getElementsByClassName("ic-inmguuii")[0];
				//icinmguuii.style.display = "block";
				//或者 img.src = this.result;  //e.target == this
			}
			reader.readAsDataURL(file);
			applyTokenDo(uploadFile);
		}
		//渲染城市
		$.ajax({
			url: "https://order.wz1996.wang/wzbg/openedcity/all",
			type: 'get',
			contentType: 'application/json',
			beforeSend: function(request) {
				request.setRequestHeader("token", localStorage.getItem("token"));
			},
			success: function(data) {
				console.log(data);
				if(data.code == "1") {
					var typeHtml = "";
					for(var i = 0; i < data.data.length; i++) {
						typeHtml += "<li id=" + data.data[i].cityId + ">" + data.data[i].cityName + "</li>";
					}
					$("#cityAll").html(typeHtml);
				} else if(data.code == "-1") {
					layar(data.msg);
					setTimeout("window.parent.frames.location.href='/xcxadmin/login.html'", 1000)
				} else {
					layar(data.msg);
				}
			},
			error: function(e) {
				errcode(e);
			}
		});

		$("#cityAll").on("click", "li", function() {
			var hasClass = $(this).hasClass("cur");
			var th = {};
			if(hasClass) {
				$(this).removeClass("cur");
				for(var i = 0; i < ctType.length; i++) {
					if(ctType[i].cityId == $(this).attr("id")) {
						ctType.splice(i, 1);
						i--;
					}
				}
				//remove(shopType, $(this).attr("id"))
			} else {
				$(this).addClass("cur");
				th['cityId'] = $(this).attr("id");
				ctType.push(th);
				//shopType.push($(this).attr("id"))
			}
			console.log(ctType)
		})

		var goods_data = {
			"status": 0
		}
		//添加已上架商品
		$.ajax({
			url: "https://order.wz1996.wang/wzbg/sku/query",
			type: 'post',
			contentType: 'application/json',
			data: JSON.stringify(goods_data),
			beforeSend: function(request) {
				request.setRequestHeader("token", localStorage.getItem("token"));
			},
			success: function(data) {
				console.log(data);
				var html = "";
				if(data.code == "1") {
					for(var i = 0; i < data.data.length; i++) {
						html += "<option value=" + data.data[i].id + ">" + data.data[i].name + "</option>";
					}
					$("#commodity2").html(html);
				} else if(data.code == "-1") {
					layar(data.msg);
					setTimeout("window.parent.frames.location.href='/xcxadmin/login.html'", 1000)
				} else {
					layar(data.msg);
				}
			},
			error: function(e) {
				errcode(e);
			}
		});

		$("#commodity1").change(function() {
			var changeVal = $("#commodity1").val();
			if(changeVal == 0) {
				$("#goodsType").show();
				$("#linkType").hide();
			} else {
				$("#goodsType").hide();
				$("#linkType").show();
			}
		})

		$("#cbQrbtn").click(function() {
			var imgUrl = $("#imghidden").val();
			var bannerName = $("#bannerName").val(); //名称
			var tstart = $("#tstart").val(); //上架时间
			var tend = $("#tend").val(); //下架时间
			var tzType = $("#commodity1 option:selected").val();
			var tzGoods = $("#commodity2 option:selected").val();
			var tzUrl = $("#tzUrl").val();
			var tzVal = "";
			var sort = $("#sort").val();
			if(tzType == 0) {
				tzVal = tzGoods;
			} else {
				tzVal = tzUrl;
			}

			if(imgUrl == "") {
				layar("请上传图片！");
			} else if(bannerName == "") {
				layar("请输入名称！");
			} else if(tstart == "") {
				layar("请选择上架时间！");
			} else if(tend == "") {
				layar("请选择下架时间！");
			} else if(ctType == "" || ctType == null || ctType == undefined) {
				layar("请选择城市！");
			} else {
				var post_data = {
					"banner": {
						"id": updateId,
						"imageUrl": imgUrl,
						"name": bannerName,
						"offDaytime": tend,
						"onDaytime": tstart,
						"sort": sort,
						"type": tzType,
						"value": tzVal
					},
					"openedCities": ctType
				}
				$.ajax({
					url: "https://order.wz1996.wang/wzbg/banner/update",
					type: 'put',
					contentType: 'application/json',
					data: JSON.stringify(post_data),
					beforeSend: function(request) {
						request.setRequestHeader("token", localStorage.getItem("token"));
					},
					success: function(data) {
						console.log(data);
						if(data.code == "1") {
							layar("修改成功！");
							setTimeout("window.location.href='../banner/banner.html'", 1000)
						} else if(data.code == "-1") {
							layar(data.msg);
							setTimeout("window.parent.frames.location.href='/xcxadmin/login.html'", 1000)
						} else {
							layar(data.msg);
						}
					},
					error: function(e) {
						errcode(e);
					}
				});
			}

		})
	</script>

</html>